<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style>
            *{
                /* 字体、内外边距、列表、超链接、颜色 */
                font: 16px "微软雅黑";
                font-weight: 400;
                margin: 0;
                padding: 0;
                list-style: none;
                text-decoration: none;
                color: #fff;
                line-height: 45px;
            }
            nav#wrapper{
                width: 1200px;
                height: 55px;
                margin: 0 auto;
                display: flex;
            }
            nav#wrapper nav.list nav.button{
                width: 200px;
                height: 45px;
                background: #ee0003;
                text-indent: 20px;
            }
            nav#wrapper nav.list nav.content{
                width: 200px;
                height: 500px;
                border: 3px solid #ee0003;
            }
            nav#wrapper nav.list nav.content ul li{
                text-indent: 10px;
                color: black;
            }
            nav#wrapper nav.head{
                line-height: 55px;
                background: red;
                width: 800px;
                height: 45px;
            }
            nav#wrapper nav.head ul li{
                float: left;
                text-indent: 30px;
            }
            
        </style>
    </head>
    <body>
       
       <nav id="wrapper">
            <nav class="list">
                <nav class="button">全部商品分类</nav>
                <nav class="content">
                    <ul>
                        <li>图片、音像、数字商品</li>
                        <li>家用电器</li>
                    </ul>
                </nav>
            </nav>
            <nav class="head">
                <ul>
                    <li>首页</li>
                    <li>服装城</li>
                    <li>食品</li>
                    <li>团购</li>
                    <li>夺宝岛</li>
                    <li>团购</li>
                    <li>金融</li>
                </ul>
            </nav>
       </nav>
            
           
    </body>
</html>